// 
import { useCallback, useState } from "react";

// 1. 创建函数组件  
function Home() {
    // 受控组件  （）初始化为空
    let [name, setName] = useState('');
    let [msg,setMsg] = useState('好啊好学习哦')
    // useCallback 可以用来缓存函数
    let getName = useCallback(()=>{
        console.log('缓存了');
        console.log(name);
        console.log(msg);
    },[name])
    return (
        <div>
            <h1>useCallback----缓存函数 </h1>
            {/* 获取输入框的值（变成受控组件）   */}
            <input type="text" value={name} onChange={(e) => {
                setName(e.target.value);
            }} />

            <button onClick={()=>{setMsg('天天向上')}}>改变msg</button>
            <button onClick={getName}>获取输入框内容</button>
        </div>
    )
}

export default Home